<!DOCTYPE html>
<html lang="zh-cmn-Hans">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>订单管理-鹿程智慧油站商户平台</title>
		<meta name="description" content="鹿程科技是提供加油站互联网化零管系统、营销及支付和大数据分析运营服务的行业领先科技公司。鹿程科技充分了解加油站行业的需求和新兴互联网的发展,依靠业内最先进的科技和标准化的运营,持续帮助油站业务发展创造价值。"/>
		<meta name="keywords" content="智慧油站,鹿程,鹿程智慧油站,鹿程智慧油站微信支付,加油站微信支付,加油站营销管理"/>
		<link rel="icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link rel="shortcut icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
		<link rel="stylesheet" href="../layui/css/layui.css" />
		<link rel="stylesheet" href="../css/style.css" />
	</head>
<body>
	<section class="order-datails">
		<!--order-datails-tit-->
		<div class="order-datails-tit">
			<span>订单编号：1087</span>
			<span>创建时间：2018-01-25 20:39:31</span>
		</div>
		<!--/order-datails-tit-->
		<!--order-datails-dl-->
		<div class="order-datails-dl">
			<dl><dt>用户名</dt><dd>123</dd></dl>
			<dl><dt>原价</dt><dd>100元</dd></dl>
			<dl><dt>实际支付</dt><dd>90.48元</dd></dl>
			<dl><dt>优惠</dt><dd>9.52
			<div class="favourable"><dl>详情</dl>
		    	<ul class="favourables">
	    			<li>油枪优惠：3.91元</li>
	    			<li>分时优惠：0元</li>
	    			<li>优惠券优惠：10元</li>
	    			<li>会员等级优惠：0元</li>
	    			<li>企业客户优惠：0.00元</li>
	    			<li>专车认证优惠：0.00元</li>
	    			<li>积分抵现优惠：0元</li>
		    	</ul>
			</dd></dl>
			<dl><dt>单价/升</dt><dd>4.2</dd></dl>
			<dl><dt>加油员</dt><dd>鹿程002</dd></dl>
			<dl><dt>油枪号</dt><dd>(ID:56) 国四0#柴油</dd></dl>
			<dl><dt>是否支付</dt><dd><span class="order-pay">已支付</span></dd></dl>
			<dl><dt>支付时间</dt><dd>2018-01-25</dd></dl>
			<dl><dt>油品评价</dt><dd>
				<div class="order-gradr">
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
				</div>
			</dd></dl>
			<dl><dt>服务评价</dt><dd>
				<div class="order-gradr">
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
				</div>
			</dd></dl>
			<dl><dt>环境评价</dt><dd>
				<div class="order-gradr">
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
					<i class="fa fa-heart gradr"></i>
				</div>
			</dd></dl>
		</div>
		<!--/order-datails-dl-->
	</section>
	
		<!--js-->
		<aside>
			<script type="text/javascript" src="../layui/layui.js" ></script>
			<script type="text/javascript">
				layui.use('jquery',function(){
					var $=layui.jquery;
					var pay=$('.order-pay');
					var payText=$('.order-pay').text();
					
					if(payText=='已支付'){
						pay.css('color','#5db2ff')
					}else{
						pay.css('color','#00cc9a')
					}
					
					//显示隐藏
					$('.favourable>dl').bind('click',function(e){
						e.stopPropagation()//取消冒泡
						$('.favourables').toggle()
					})
					//取消冒泡
					$('.favourables').bind('click',function(e){
						e.stopPropagation()
					})
					//全局点击
					$(document).bind('click',function(){
						$('.favourables').hide()
					})

				})
				
			</script>
		</aside>
		<!--js-->	
	
	
</body>
</html>